<!--
	作者：1055471363@qq.com
	时间：2017-12-12
	描述：本人设备作业量
-->
<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>本人设备作业量</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../css/jquery.mobile-1.4.5.css" />
		<script type="text/javascript" src="../../js/jquery.min.js"></script>
		<script type="text/javascript" src="../../js/jquery.mobile-1.4.5.min.js"></script>
		<script type="text/javascript" src="../../base.js"></script>

		<style>
			.mui-bar {
				background-color: #0088BB;
			}
			
			.mui-title {
				color: #FFFFFF
			}
			
			a {
				color: #FFFFFF
			}
			.ui-table-columntoggle-btn {
				display: none !important;
			}
			
			tr {
				border-bottom: 1px solid #d6d6d6;
			}
			
			th {
				border-bottom: 1px solid #d6d6d6;
			}
			
			tr:nth-child(even) {
				background: #e9e9e9;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav" id="user">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">本人设备作业量{{name}}</h1>
		</header>
		<div class="mui-content" id="oneselfEqpTable">
			<div data-role="main" class="ui-content">
				<table data-role="table" data-mode="columntoggle" class="ui-responsive ui-shadow">
					<thead>
						<tr>
							<th>设备名称</th>
							<th>作业量</th>
						</tr>
					</thead>
					
					<tbody>
						<tr>
							<td>{{items.EQPID}}</td>
							<td>{{items.DoneQty}}</td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/vue.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init()
			var user = localStorage.getItem("user")
			var app = new Vue({
				el: '#user',
				data: {
					name: "(" + user + ")"
				}
			})
			var vm = new Vue({
				el: '#oneselfEqpTable',
				data: {
					//					banner: {}, //顶部工号数据
					items: {} //table信息流数据
				},
				mounted: function() {
					var _this = this;
					var user = localStorage.user;

					mui.ajax(base + '/SerchSelfOutPut.json', {
						data: {
							USERNAME: user
						},
						dataType: 'json', //服务器返回xml格式数据
						type: 'post', //HTTP请求类型
						timeout: 30000, //超时时间设置为10秒；
						async: true,
						success: function(data) {
							_this.items = data.SendQtyList
						},
						error: function(xhr, type, errorThrown) {
							mui.toast("网络异常");
						}
					});
				}
			})
		</script>
	</body>

</html>